<template>
	<view class="content">
		<view class="lf-info" @click="handleToLogin" v-if="!store_token">
			<u-avatar src=""></u-avatar>
			<view class="no-login-txt">注册/登录</view>
			<u-button @click="setLogin">模拟登录</u-button>
		</view>
		<view class="has-token" v-else>
			<view class="tip">登录成功</view>
			<view class="line">
				<u-button type="primary" class="" v-if="store_is_vol !== 1" @click="handleToCertification">去认证</u-button>
			</view>
			<view class="line">
				<u-button type="error" shape="circle" @click="handleLoginOut">退出登录</u-button>
			</view>
		</view>
		
		<u-toast ref="uToast" />
	</view>
</template>

<script>
import { LOGIN_OUT } from '@/store/types.js';
import md5 from '@/utils/md5.js'

export default {
	methods: {
		handleToLogin() {
			this.navigateToLogin();
		},
		// 去认证
		handleToCertification() {
			this.navigateTo({
				url: "/pages/my/certification/index"
			})
		},
		// 退出登录
		handleLoginOut() {
			this.$store.commit(LOGIN_OUT);
			this.$refs.uToast.show({
				title: '退出登录成功',
				type: 'success',
				duration: 2000
			});
		},
		setLogin() {
			this.$store.dispatch('login',{
				loginCode: '13723878143',
				password: md5('qq111111')
			})
		}
	}
};
</script>

<style lang="scss">
.content {
	padding: 30rpx;
}
.lf-info {
	display: flex;
	align-items: center;
	width: 100%;
	.no-login-txt {
		font-size: 40rpx;
		margin-left: 40rpx;
	}
	.user-img {
		width: 118rpx;
		height: 118rpx;
		border-radius: 50%;
		background-color: #ddd;
		margin-right: 20rpx;
	}
}

.has-token {
	.tip {
		text-align: center;
		color: $u-type-success;
		font-size: 48rpx;
		margin-bottom: 60rpx;
	}
}

.line{
	margin: 30rpx 0;
}
</style>
